<ng-container *ngIf="!outlet.isActivated">
    <ts-datepicker #datepickerOne="tsDatepicker" [(ngModel)]="search.params.start" [color]="global.params.color" [weekTitles]="['一', '二', '三', '四', '五', '六', '日']"
        [monthTitles]="['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']">
    </ts-datepicker>
    <ts-datepicker #datepickerTwo="tsDatepicker" [(ngModel)]="search.params.end" [color]="global.params.color" [weekTitles]="['一', '二', '三', '四', '五', '六', '日']"
        [monthTitles]="['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']">
    </ts-datepicker>
    <div class="toolbar">
        <div tsCollapses [auto]="true">
            <div class="input-group mb-3">
                <div class="input-group-prepend">
                    <span class="input-group-text bg-white">企业名称</span>
                </div>
                <input [(ngModel)]="search.params.name" type="text" class="form-control" placeholder="请输入企业名称关键词">
            </div>
            <div class="input-group mb-3">
                <div class="input-group-prepend">
                    <span class="border-0 input-group-text bg-white">所在区域</span>
                </div>
                <!-- <label class="input-group-text text-center col-form-label label-required">所在区域</label> -->
                <div class="ml-1 row p-0" style="width: calc(100% - 85px);">
                    <div class="col pl-0">
                        <select [(ngModel)]="goods.goodsParentType" class="custom-select" placeholder="请选择一级分类">
                            <option *ngFor="let type of parentTypes" [ngValue]="type.value">{{type.text}}</option>
                        </select>
                    </div>
                    <div class="col">
                        <select [(ngModel)]="goods.goodsType" class="custom-select" placeholder="请选择二级分类">
                            <option *ngFor="let type of getChildTypes" [ngValue]="type.value">{{type.text}}</option>
                        </select>
                    </div>
                    <div class="col">
                        <select [(ngModel)]="goods.goodsThreeType" class="custom-select" placeholder="请选择二级分类">
                            <option *ngFor="let type of getThreeTypes" [ngValue]="type.value">{{type.text}}</option>
                        </select>
                    </div>
                    <div class="col pr-0">
                        <select [(ngModel)]="goods.goodsThreeType" class="custom-select" placeholder="请选择二级分类">
                            <option *ngFor="let type of getThreeTypes" [ngValue]="type.value">{{type.text}}</option>
                        </select>
                    </div>
                </div>
            </div>
            <div tsCollapse>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-white">区域结构</span>
                    </div>
                    <input [(ngModel)]="search.params.name" type="text" class="form-control" placeholder="请输入区域结构关键词">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-white">员工姓名</span>
                    </div>
                    <input [(ngModel)]="search.params.name" type="text" class="form-control" placeholder="请输入员工姓名关键词">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-white">手机号</span>
                    </div>
                    <input [(ngModel)]="search.params.name" type="text" class="form-control" placeholder="请输入手机号关键词">
                </div>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text bg-white">创建时间</span>
                    </div>
                    <input tsToggle [bind]="datepickerOne" [target]="datepickerOne" type="text" [value]="search.params.start" class="form-control bg-white pointer"
                        placeholder="开始时间" readonly>
                    <div class="input-group-prepend input-group-append">
                        <span class="input-group-text bg-white">到</span>
                    </div>
                    <input tsToggle [bind]="datepickerTwo" [target]="datepickerTwo" type="text" [value]="search.params.end" class="form-control bg-white pointer"
                        placeholder="结束时间" readonly>
                </div>
                <div class="row">
                    <div class="col-6">
                        <div class="input-group">
                            <div class="input-group-prepend">
                                <span class="input-group-text bg-white">共查询到</span>
                            </div>
                            <input type="text" value="{{pagination.total}}" class="form-control text-center bg-white" readonly placeholder="0">
                            <div class="input-group-append">
                                <span class="input-group-text bg-white">条/结果</span>
                            </div>
                        </div>
                    </div>
                    <div class="col-6 text-right m-btn">
                        <button class="btn btn-success" routerLink="detail">
                            <span>新增企业</span>
                        </button>
                        <button (click)="doReset()" class="btn btn-white">
                            <i class="iconfont icon-refresh mr-2"></i>
                            <span>重置</span>
                        </button>
                        <button (click)="doSearch()" class="btn btn-white">
                            <i class="iconfont icon-search mr-2"></i>
                            <span>搜索</span>
                        </button>
                    </div>
                </div>
            </div>
            <div class="text-center">
                <div class="card-header pointer" tsToggle>
                    <span class="mr-1">{{open?'收起':'展开'}}</span>
                    <i tsIcon="{{open?'shouqi':'zhankai'}}"></i>
                </div>
            </div>
        </div>
    </div>
    <div class="p-2 bg-white">
        <div class="card-body">
            <h4 style="font-size: 1.1rem;font-weight:400;" class="mt-5 mb-5 text-center">企业用户</h4>
            <div class="table-responsive">
                <table class="table table-striped">
                    <tbody>
                        <tr class="font-weight-bold bg-light">
                            <td *ngFor="let th of theads">{{th}}</td>
                        </tr>
                        <tr *ngFor="let td of list;index as i">
                            <td>{{td.id}}</td>
                            <td>{{td.enterpriseName}}</td>
                            <td>{{td.managerName}}</td>
                            <td>{{td.mobile}}</td>
                            <td>{{td.maxUserNumber}}</td>
                            <td>{{td.maxCustomerNumber}}</td>
                            <td>...</td>
                            <td>{{td.areaId}}</td>
                            <td>...</td>
                            <td>....</td>
                            <td>...</td>
                            <td>{{td.contractAttachment}}</td>
                            <td>
                                <ts-switch name="status" [color]="global.getValue('color')" [values]="{open:1,close:0}" [(ngModel)]="td.status"  (ngModelChange)="change(td)">
                                </ts-switch>
                            </td>
                            <td>
                                <!-- <span (click)="confirmDelete()" tsTip="审核" class="btn-icon btn-icon-success">
                                    <i tsIcon="shenhe"></i>
                                </span> -->
                                <span (click)="confirmDelete(td.id,td.status)" tsTip="删除" class="btn-icon btn-icon-danger">
                                    <i tsIcon="delete"></i>
                                </span>
                                <span tsTip="详情/编辑" class="btn-icon btn-icon-info" routerLink="detail/{{td.id}}">
                                    <i tsIcon="edit"></i>
                                </span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="text-right">
                <ts-pagination (pageChange)="loadDatas()" [pagination]="pagination" [items]="[{text:'显示 5 条',value:5},{text:'显示 10 条',value:10},{text:'显示 20 条',value:20}]"
                    [color]="global.params.color" goTitle="跳转" prevTitle="上一页" nextTitle="下一页" startTitle="首页" endTitle="末尾"
                    outline></ts-pagination>
            </div>
        </div>

        <div class="card-body">
            <h4 style="font-size: 1.1rem;font-weight:400;" class="mt-5 mb-5 text-center">在线用户</h4>

            <!-- <ts-table-load [display]="loading"></ts-table-load> -->
            <div class="table-responsive">
                <table class="table table-striped">
                    <tbody>
                        <tr class="font-weight-bold bg-light">
                            <td *ngFor="let th of onlineTheads">{{th}}</td>
                        </tr>
                        <tr>
                            <td>1</td>
                            <td>2
                                <!-- <img tsImg [src]="td.goodsThumb" dataSrc="assets/images/404.jpg" class="rounded-circle" width="40" height="40" alt="Logo"> -->
                            </td>
                            <td>3</td>
                            <td>4</td>
                            <td>5</td>
                            <!-- {{td.createdAt.substring(0,10)|date:'yyyy/MM/dd'}} -->
                            <td>6</td>
                            <td>3</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="text-right">
                <ts-pagination (pageChange)="loadDatas()" [pagination]="pagination" [items]="[{text:'显示 5 条',value:5},{text:'显示 10 条',value:10},{text:'显示 20 条',value:20}]"
                    [color]="global.params.color" goTitle="跳转" prevTitle="上一页" nextTitle="下一页" startTitle="首页" endTitle="末尾"
                    outline></ts-pagination>
            </div>
        </div>
    </div>

</ng-container>

<router-outlet #outlet="outlet"></router-outlet>